<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>列表页</title>
    <link rel="stylesheet" href="./css/list.min.css">
</head>

<body>
    <div class="web">
        <!-- 公共头部 -->
        <header>
            <div class="border-top"></div>
            <div class="header-content">
                <div class="logo">
                    <img src="./image/header/logo.png" alt="">
                </div>
                <!-- 导航 -->
                <nav>
                    <ul>
                        <li class="active"><a href="">首页</a></li>
                        <li><a href="">关于鼎搜</a></li>
                        <li><a href="">鼎搜服务</a></li>
                        <li><a href="">鼎搜动态</a></li>
                        <li><a href="">鼎搜诚聘</a></li>
                        <li><a href="">鼎搜公益</a></li>
                    </ul>
                </nav>
                <!-- 搜索框 -->
                <div class="search">
                    <input type="text">
                </div>
            </div>
            <!-- 顶部大图 -->
            <div class="banner">
                <img src="./image/header/banner.png" alt="">
            </div>
        </header>
        <main>
            <!-- 当前位置栏 -->
            <div class="location-bar">
                <div class="blue-box">
                    当前位置
                </div>
                <div class="title">：主页 > 我要投资 > 投资列表</div>
            </div>
            <!-- 分类列表 -->
            <div class="category-list">
                <ul>
                    <li><img src="./image/list/list.png" alt="">按类型：<span class="all">全部</span> <span class="more">股权转让
                            债权转让 实物资产 工美藏品 知识产权 经营产权 房产 矿权 林权 融资 更多</span></li>
                    <li><img src="./image/list/cup.png" alt="">按行业：<span class="all">全部</span> <span class="more">房地产业
                            电子通讯 电力工业 煤炭工业 冶金矿产 机械制造 基础设施 建筑建材 物流仓储 更多</span>
                    </li>
                    <li><img src="./image/list/square.png" alt="">按地区：<span class="all">全部</span> <span class="more">北京
                            天津 上海 重庆 河北 山西 浙江 辽宁 吉林 湖北 江苏 安徽 福建 江西 台湾 香港
                            澳门 广东 更多</span></li>
                </ul>
            </div>
            <!-- 详细列表 -->
            <div class="detail-list">
                <!-- 列表头部 -->
                <div class="table-header">
                    <div class="white-box">
                        <span>项目名称</span>
                        <span>所在地区</span>
                        <span>行业</span>
                        <span>类型</span>
                        <span>发布时间</span>
                    </div>
                </div>
                <!-- 列表主体 -->
                <div class="list-body">
                    <!-- 列表内容 -->
                    <div class="list-content">
                        <ul>
                            <li>[广州天河龙洞] 可圈可点茶餐厅</li>
                            <li>[广州天河龙洞] 可圈可点茶餐厅</li>
                            <li>[广州天河龙洞] 可圈可点茶餐厅</li>
                            <li>[广州天河龙洞] 可圈可点茶餐厅</li>
                            <li>[广州天河龙洞] 可圈可点茶餐厅</li>
                            <li>[广州天河龙洞] 可圈可点茶餐厅</li>
                            <li>[广州天河龙洞] 可圈可点茶餐厅</li>
                            <li>[广州天河龙洞] 可圈可点茶餐厅</li>
                            <li>[广州天河龙洞] 可圈可点茶餐厅</li>
                            <li>[广州天河龙洞] 可圈可点茶餐厅</li>
                            <li>[广州天河龙洞] 可圈可点茶餐厅</li>
                            <li>[广州天河龙洞] 可圈可点茶餐厅</li>
                            <li>[广州天河龙洞] 可圈可点茶餐厅</li>
                            <li>[广州天河龙洞] 可圈可点茶餐厅</li>
                        </ul>
                        <ul>
                            <li>广东</li>
                            <li>广东</li>
                            <li>广东</li>
                            <li>广东</li>
                            <li>广东</li>
                            <li>广东</li>
                            <li>广东</li>
                            <li>广东</li>
                            <li>广东</li>
                            <li>广东</li>
                            <li>广东</li>
                            <li>广东</li>
                            <li>广东</li>
                            <li>广东</li>
                        </ul>
                        <ul>
                            <li>餐饮餐馆</li>
                            <li>餐饮餐馆</li>
                            <li>餐饮餐馆</li>
                            <li>餐饮餐馆</li>
                            <li>餐饮餐馆</li>
                            <li>餐饮餐馆</li>
                            <li>餐饮餐馆</li>
                            <li>餐饮餐馆</li>
                            <li>餐饮餐馆</li>
                            <li>餐饮餐馆</li>
                            <li>餐饮餐馆</li>
                            <li>餐饮餐馆</li>
                            <li>餐饮餐馆</li>
                            <li>餐饮餐馆</li>
                        </ul>
                        <ul>
                            <li>股权转让</li>
                            <li>股权转让</li>
                            <li>股权转让</li>
                            <li>股权转让</li>
                            <li>股权转让</li>
                            <li>股权转让</li>
                            <li>股权转让</li>
                            <li>股权转让</li>
                            <li>股权转让</li>
                            <li>股权转让</li>
                            <li>股权转让</li>
                            <li>股权转让</li>
                            <li>股权转让</li>
                            <li>股权转让</li>
                        </ul>
                        <ul>
                            <li>2015-06-09</li>
                            <li>2015-06-09</li>
                            <li>2015-06-09</li>
                            <li>2015-06-09</li>
                            <li>2015-06-09</li>
                            <li>2015-06-09</li>
                            <li>2015-06-09</li>
                            <li>2015-06-09</li>
                            <li>2015-06-09</li>
                            <li>2015-06-09</li>
                            <li>2015-06-09</li>
                            <li>2015-06-09</li>
                            <li>2015-06-09</li>
                            <li>2015-06-09</li>
                        </ul>
                    </div>
                </div>
            </div>
            <!-- 页码切换 -->
            <div class="page-switch">
                <button class="last-page">上一页</button>
                <button class="page-one">1</button>
                <button class="page-two">2</button>
                <button class="page-three">3</button>
                <button class="page-four">4</button>
                <button class="page-five">5</button>
                <button class="next-page">下一页</button>
            </div>
        </main>
        <!-- 底部 -->
        <footer>
            <!-- 装饰线 -->
            <hr>
            <!-- 列表 -->
            <div class="footer">
                <ul>
                    <li>简介</li>
                    <li><a href="">鼎搜网简介</a></li>
                    <li><a href="">鼎搜服务</a></li>
                    <li><a href="">会员身份实名认证</a></li>
                </ul>
                <ul>
                    <li>帮助</li>
                    <li><a href="">用户注册</a></li>
                    <li><a href="">关于鼎搜</a></li>
                    <li><a href="">在线咨询</a></li>
                </ul>
                <ul>
                    <li>共赢</li>
                    <li><a href="">网站合作</a></li>
                    <li><a href="">用户协议</a></li>
                    <li><a href="">会员身份实名认证</a></li>
                </ul>
                <ul>
                    <li>导航</li>
                    <li><a href="">地图首页</a></li>
                    <li><a href="">职能分类</a></li>
                    <li><a href="">企业名录</a> </li>
                </ul>
                <div class="connect">
                    <img src="./image/footer/connect.png" alt="">
                </div>
            </div>
            <!-- 底部蓝色 -->
            <div class="border-bottom">
                Copyright ©2015 鼎搜网(www.dinsoo.com) 版权所有
            </div>
        </footer>
    </div>
</body>

</html>